<template>
	<view>
		<view class="top" v-if="status==1||status==2||status==3">
			<view class="title">{{ title }}</view>

			<view class="price">¥<text>{{ price }}</text></view>

			<view class="order">订单号：{{ orderNo }}</view>
		</view>
		<view class="top" v-if="status==0">
			<view class="title">
				<image src="https://friend.tanshishang.cn/assets/img/tag-vip.png" mode=""></image>
				开通VIP需要支付（有效期一年）
			</view>

			<view class="price">¥<text>{{ price }}</text></view>

			<view class="order">订单号：{{ orderNo }}</view>
		</view>

		<view class="title2">选择支付方式</view>
		<view class="box">
			<view class="left">
				<i class="iconfont iconweixinzhifu wx" style="font-size: 40rpx;"></i>微信支付
			</view>
			<!-- <i class="iconfont iconweixuan icon" style="color: #CCCCCC;" v-if="chooseStatus" @tap="change" ></i> -->
			<i class="iconfont icongouxuan icon" style="color: #0091FF;"></i>
		</view>

		<view class="foot">
			<button type="default" class="btn" @tap="toPay">确认支付</button>
		</view>

	</view>
</template>

<script>
	import {
		mapState,
		mapActions
	} from 'vuex'
	export default {
		computed: {
			...mapState(['token'])
		},
		data() {
			return {
				chooseStatus: false,
				status: 0,
				orderNo: null,
				title: '',
				price: '',
				back: ''
			};
		},
		onLoad(options) {
			console.log(options);
			//type 0开通vip  1普通支付 2vip续费  3约会邀请
			if (options.type && options.type == 1) {
				options.orderNo ? this.orderNo = options.orderNo : '';
				options.type ? this.status = options.type : '';
				options.title ? this.title = options.title : '';
				options.price ? this.price = Number(options.price).toFixed(2) : '';
			} else if (options.type && options.type == 2) {
				options.orderNo ? this.orderNo = options.orderNo : '';
				options.type ? this.status = options.type : '';
				options.title ? this.title = options.title : '';
				options.price ? this.price = Number(options.price).toFixed(2) : '';
			} else if (options.type && options.type == 3) {
				options.orderNo ? this.orderNo = options.orderNo : '';
				options.type ? this.status = options.type : '';
				options.title ? this.title = options.title : '';
				options.price ? this.price = Number(options.price).toFixed(2) : '';
				options.from ? this.back = 1 : '';
			} else {
				options.orderNo ? this.orderNo = options.orderNo : '';
				options.type ? this.status = options.type : '';
				options.price ? this.price = Number(options.price).toFixed(2) : '';
			}



		},
		methods: {
			//点击支付
			toPay() {
				if (this.status == 0) {
					//vip
					this.doVipPay();
				} else if (this.status == 1) {
					//普通支付
					this.doPay();
				} else if (this.status == 2) {
					//续费
					this.doVipMore()
				} else if (this.status == 3) {
					if (this.back) {
						//消息同意约会邀请
						this.doDate();
					} else {
						//约会邀请
						this.doDate2();
					}
				}

			},
			//修改勾选状态
			change() {
				this.chooseStatus = !this.chooseStatus;
			},
			//同意约会
			async doDate2() {
				try {
					let params = {
						token: this.token,
						orderNo: this.orderNo
					};
					let res = await this.$request.request.post('/api/index/buy', params)
					console.log(res);
					uni.hideLoading();
					//再发起微信支付
					uni.requestPayment({
						provider: 'wxpay',
						timeStamp: res.data.timeStamp,
						nonceStr: res.data.nonceStr,
						package: res.data.package,
						signType: res.data.signType,
						paySign: res.data.paySign,
						success: res => {
							this.$tips.success("支付成功!");
							setTimeout(() => {
								uni.navigateBack({
									delta: this.back
								})
							}, 2000);
						},
						fail: (err) => {
							console.log(err);
							this.$tips.fail("支付失败");
						}
					});
				} catch (err) {
					this.$request.error(err, this)
				}
			},
			//约会邀请
			async doDate() {
				try {
					let params = {
						token: this.token,
						orderNo: this.orderNo
					};
					let res = await this.$request.request.post('/api/index/buy', params)
					console.log(res);
					uni.hideLoading();
					//再发起微信支付
					uni.requestPayment({
						provider: 'wxpay',
						timeStamp: res.data.timeStamp,
						nonceStr: res.data.nonceStr,
						package: res.data.package,
						signType: res.data.signType,
						paySign: res.data.paySign,
						success: (res) => {
							console.log(res);
							// uni.showToast({
							// 	title:'支付成功，请等待对方确认是否愿意约会，系统会给您发送消息告知结果。',
							// 	icon:'none',
							// 	mask:true
							// })
							// setTimeout(() => {
							// 	uni.navigateBack({
							// 		delta: this.back
							// 	})
							// }, 2000);
							uni.showModal({
								title: '支付成功',
								content: '请等待对方确认是否同意约会，系统会给您发送消息告知结果。',
								showCancel: false,
								confirmText: '知道了',
								success: (res) => {
									// console.log(res);
									if (res.confirm) {
										uni.navigateBack({
											delta: this.back
										})
									} else if (res.cancel) {
										console.log('用户点击取消');
									}

								}
							});
						},
						fail: (err) => {
							console.log(err);
							this.$tips.fail("支付失败");
						}
					});
				} catch (err) {
					this.$request.error(err, this)
				}
			},
			//续费支付
			async doVipMore() {
				try {
					let params = {
						token: this.token,
						orderNo: this.orderNo
					};
					let res = await this.$request.request.post('/api/user/buy', params)
					console.log(res);
					uni.hideLoading();
					//再发起微信支付
					uni.requestPayment({
						provider: 'wxpay',
						timeStamp: res.data.timeStamp,
						nonceStr: res.data.nonceStr,
						package: res.data.package,
						signType: res.data.signType,
						paySign: res.data.paySign,
						success: res => {
							this.$tips.success("支付成功");
							setTimeout(() => {
								uni.navigateBack({
									delta: 2
								})
							}, 2000);
						},
						fail: (err) => {
							console.log(err);
							this.$tips.fail("支付失败");
						}
					});
				} catch (err) {
					this.$request.error(err, this)
				}
			},
			//vip支付
			async doVipPay() {
				try {
					let params = {
						token: this.token,
						orderNo: this.orderNo
					};
					let res = await this.$request.request.post('/api/user/buy', params)
					console.log(res);
					uni.hideLoading();
					//再发起微信支付
					uni.requestPayment({
						provider: 'wxpay',
						timeStamp: res.data.timeStamp,
						nonceStr: res.data.nonceStr,
						package: res.data.package,
						signType: res.data.signType,
						paySign: res.data.paySign,
						success: res => {
							this.$tips.success("支付成功");
							setTimeout(() => {
								uni.navigateBack({
									delta: 2
								})
							}, 2000);
						},
						fail: (err) => {
							console.log(err);
							this.$tips.fail("支付失败");
						}
					});
				} catch (err) {
					this.$request.error(err, this)
				}
			},
			//调用微信支付
			async doPay() {
				try {
					let params = {
						token: this.token,
						orderNo: this.orderNo
					};
					let res = await this.$request.request.post('/api/engagement/ngagement', params)
					console.log(res);
					uni.hideLoading();
					//再发起微信支付
					uni.requestPayment({
						provider: 'wxpay',
						timeStamp: res.data.timeStamp,
						nonceStr: res.data.nonceStr,
						package: res.data.package,
						signType: res.data.signType,
						paySign: res.data.paySign,
						success: res => {
							this.$tips.success("支付成功");
							setTimeout(() => {
								uni.navigateBack({
									delta: 2
								})
							}, 2000);
						},
						fail: (err) => {
							console.log(err);
							this.$tips.fail("支付失败");
						}
					});
				} catch (err) {
					this.$request.error(err, this)
				}
			},
		}
	}
</script>

<style lang="scss">
	@import 'payInfo.scss'
</style>
